<template>
  <div>
  <swiper>
    <swiper-item v-for="(item,Key)  in banners" :key="Key">
      <a :href="item.link"></a>
        <img :src="item.image" alt="" @load="imageLoad">
    </swiper-item>
  </swiper>
  </div>
</template>

<script>
  import { Swiper,SwiperItem} from "components/common/swiper"
    export default {
        name: "HomeSwiper",
      props:{
        banners:{
          type:Array,
          default(){
            return []
          }
        }
      },
      data(){
          return{
            isLoad:false
          }
      },
      components:{
        SwiperItem,
        Swiper
      },
      methods:{
        imageLoad(){
          if (!this.isLoad){
            this.$emit('swiperImageLoad')
            this.isLoad = true
          }
        }
      }
    }
</script>

<style scoped>

</style>
